@import './media_queries.styl'

ul
  list-style-type square
  padding 0 0 0 1em
  margin 0

ul.plain
  list-style none
  padding 0
  margin 0

ul.flex
  flex 1 1 auto
  display flex
  flex-flow row wrap
  justify-content flex-start
  li
    display flex
    flex 1 1 
  li.half
    position relative
    display flex
    align-items center
    flex 1 1 50%
    .data-field
      flex 1
      width 100% !important 

@media $media_xsmall_max
  ul.flex
    li.half
      flex 1 1 100%

dl 
  display inline-block
  clear both  
dt,dd
  float left
dt
  font-weight bold
  clear both
  margin-bottom 1em

dl.data
  dt 
    font-weight bold

ul.data
  list-style none
  display flex
  flex-flow column wrap
  align-items flex-start
  max-width 100%
  li  
    flex 1
    display flex
    flex-flow row wrap
    justify-content center
    .field-title
      font-weight bold
      text-transform capitalize
      &:after 
        content ':'
    .field-title
      flex 1
    
    .field-value
      flex 1
      display inline-flex

ul.prev-next
  width 100%
  list-style none
  display flex
  justify-content space-between
  margin 0
  padding 0
  max-width 100%
  li 
    flex 0 1 auto
    margin 0
  .total 
    flex 2 0 auto
    text-align center  
  .prev
    margin-left 1em
    .icon, .svg-icon
      margin-right  1em
  .next
    margin-right 1em
    .icon, .svg-icon
      margin-left  1em

ul.list, .list-head, .list-item, .list-buttons
  list-style none
  padding 0
  margin 0
  li
    padding 0
    margin 0
    
ul.list
  display flex 1 100%
  flex-flow column nowrap
  min-width 100%
  li
    flex 2 1 100% 
    padding .5rem 1rem
    &.even
      even()
      border $darkness-odd solid 1px
    &.odd
      odd()
      border $darkness-even solid 1px
    
ul.list-head, ul.list-buttons
  display inline-flex
  li
    padding 0    

ul.list-head li:first-child
  letter-spacing .0625em
  font-weight bold

ul.list-buttons
  display flex 
  li
    text-align right
    justify-content center

ul.list-item
  display flex
  flex-flow row wrap
  padding 0 .5em 
  li
    padding 0
    flex 1 0 100%
    margin-bottom .5em
  li.col
    flex 1 2 

ul.list li.min
  display flex
  justify-content flex-end
  border none
  ul.list-head
    flex 2 2 60%
  li
    display inline-flex
    display none
  
  ul.list-head, ul.list-buttons
    display inline-flex
    flex-flow row nowrap 
    align-items flex-start
    li 
      display inline
  
  ul.list-head li:first-child
    font-weight normal
  
  li.action
    display inline-flex
    flex-flow row nowrap
    justify-content flex-end
    align-items flex-end
    button
      font-size .6em
      margin-left .5em


.list.dark
  color $color

.raw-list
  ul
    list-style-type none